<!--
 * @Author: cqg 
 * @Date: 2020-11-11 10:43:14
 * @LastEditors: cqg
 * @LastEditTime: 2020-11-19 17:35:02
 * @Description: file content
-->
<!-- 审批记录列表组件 -->
<template>
  <div class="cApprovalRecord">
    <div class="c_l avatar">
      <el-avatar> {{ approvalPerson }} </el-avatar>
    </div>
    <div>
      <p>{{ approvalPerson }}</p>
      <p>办理环节：{{ step }} 办理结果：{{getDict(approvalResult).label }}</p>
      <p>办理意见：{{ opinion }}</p>
    </div>
    <div class="c_r">
      <p>{{ operateTime }}</p>
    </div>
  </div>
</template>

<script>
import { getDict } from '~/utils'

export default {
  name: 'approval-record',
  props: {
    //用户名称
    approvalPerson: {
      type: String,
      default: '',
    },
    //用户名称
    approvalResult: {
      type: String,
      default: '',
    },
    step: {
      type: String,
      default: '',
    },
    opinion: {
      type: String,
      default: '',
    },
    operateTime: {
      type: String,
      default: '',
    },
  },
  methods: {
    getDict(v) {
      return getDict('approval_result').find((e) => {
        return e.value == v
      })
    },
  },
}
</script>
<style lang="scss" >
.cApprovalRecord {
  height: 80px;
  width: 100%;
  border-bottom: 1px solid rgba(97, 106, 120, 0.07);
  .c_l {
    width: auto;
    height: 56px;
    float: left;
    p:nth-child(-n + 1) {
      color: rgba(97, 106, 120, 0.5);
    }
  }
  .c_r {
    width: 15%;
    height: 56px;
    float: right;
    p {
      margin: 0 auto;
    }
  }
  .avatar {
    margin: 12px 5px 12px 0;
  }
}
</style>
